<template>
  <commonSelect :value="value" :url="urlObj.list" :optionKey="optionKey" @change="changeUser" v-bind="$attrs"/>
</template>

<script>
import commonSelect from './common-select.vue'
export default {
	components:{
		commonSelect
	},
	props:{
		value: {
			type: String,
			default: ''
		}
	},
  data() {
    return {
			urlObj:{
				list:'/user/list'
			},
			optionKey:{
				label: 'nickname', value: 'username'
			}
    }
  },
  methods: {
		changeUser(values,rows){
			this.$emit('change',values,rows)
		}
  },
	model: {
		prop: 'value',
		event: 'change'
	}
};
</script>

<style lang="scss">
	.uni-list{
		width: 100%;
	}
	.uni-list-item {
		border-bottom-style: solid;
		border-bottom-width: 1px;
		border-bottom-color: #eee;
		font-size: 14px;
	}

	.uni-list-item__container {
		/* #ifndef APP-NVUE */
		display: flex;
		width: 100%;
		box-sizing: border-box;
		/* #endif */
		padding: 12px 15px;
		flex: 1;
		position: relative;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.uni-list-item__content-title {
		font-size: 14px;
		color: #666;
	}
	.popup-content {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		// top: 0;
		background-color: #ffffff;
	}
	.pop {
		&-header {
			height: 44px;
			border-bottom: 1px solid #ebedf0;
			background-color: #f7f8fa;
			align-items: center;
			display: flex;
			justify-content: center;
			font-size: 26rpx;
	
			&-left {
				width: 44px;
				text-align: center;
				color: #666;
			}
	
			&-right {
				width: 44px;
				text-align: center;
			}
	
			&-title {
				flex: 4;
				text-align: center;
				color: 32rpx;
				padding: 0 5px;
			}
		}
	
		&-main {
			overflow-x: hidden;
			overflow-y: auto;
			-webkit-overflow-scrolling: touch;
			scroll-behavior: smooth;
			height: 40vh;
		}
	}
	.user-warp{
		width: 100%;
	}
</style>